$(function () {
  initBussinessCost = 1;
  initBussinessCostData();
});

//界面数据初始化
function initBussinessCostData() {
  //请求参数
  var obj = {
    budgetYear: fullYear,
    budgetMonth: fullMonth,
    dept: fullDepartment,
    status: 2,
    chartPage: "5010101",
  };
  //API
  ApiGet("getdata", obj, function (e) {
    var json = JSON.parse(e);
    var chartData = json.items[0].charts;
    setPanel(chartData);
    getMonBudget(chartData);
    getEvBudget(chartData);
    getBusinessRate(chartData);
    getBusinessRatee(chartData);
    getBusinessInfo(chartData);
    getBusinessInfoo(chartData);
  });
}

//设置面板
function setPanel(data) {
  var alldata = data;

  function format(num) {
    undefined;
    return (num.toFixed(2) + "").replace(
      /\d{1,3}(?=(\d{3})+(\.\d*)?$)/g,
      "$&,"
    );
  }

  var implementprecent = alldata[0]["data"][0]["key01"] * 100;
  var implementprecent = implementprecent.toFixed(1);

  var implementmoney = alldata[0]["data"][0]["key02"] / 10000;
  var implementmoney = implementmoney.toFixed(2);
  var implementmoney = parseFloat(implementmoney);
  var implementmoney = format(implementmoney);

  var leftmoney = alldata[0]["data"][0]["key03"] / 10000;
  var leftmoney = leftmoney.toFixed(2);
  var leftmoney = parseFloat(leftmoney);
  var leftmoney = format(leftmoney);

  var totalimplement = alldata[0]["data"][0]["key04"] / 10000;
  var totalimplement = totalimplement.toFixed(2);
  var totalimplement = parseFloat(totalimplement);
  var totalimplement = format(totalimplement);

  $(".implementmoney").text(implementmoney);
  $(".leftmoney").text(leftmoney);
  $(".totalimplement").text(totalimplement);
  $(".implementprecent").text(implementprecent);
  $(".progress").width(implementprecent + "%");
}

function getMonBudget(data) {
  var alldata = data;
  var thisdata = alldata[1]["data"];
  var xarray = [];
  var yarray = [];

  for (let i = 0; i < thisdata.length; i++) {
    xarray.push(thisdata[i]["key01"]);
    yarray.push(parseInt(thisdata[i]["key02"] * 100));
  }
  var chartDom = document.getElementById("monthlybudget");
  var myChart = echarts.init(chartDom);
  var option;
  // let image;
  // let imageColor;
  option = {
    grid: {
      show: false,
      top: "50px",
      left: "30px",
      right: "10px",
      bottom: "43px",
    },
    // grid: {
    // 	left: '0',
    // 	right: '10',
    // 	bottom: '14',
    // 	top: '30',
    // 	containLabel: true
    // },

    tooltip: {
      show: true,
      trigger: "axis",
      show: true,
      extraCssText: "width:180px;height:70px;",
      formatter: function (params) {
        for (var i = 0; i < params.length; i++) {
          var res =
            "<div style='margin-left:0px;margin-bottom:7px;padding:0;width:120px;height:24px;line-height:10px;border-radius:3px;font-size: 12px;font-weight: 500;color: #1D2129;'><p style='font-weight:500;'>" +
            params[0]["axisValue"] +
            "月</p></div>" +
            "<div style='display: flex; flex-direction: row; align-items: center; justify-content: space-between; margin-top:-10px; width:160px; background:white; height:30px;border-radius: 4px 4px 4px 4px; color: #fff;font-size: 14px; padding:0 12px;line-height: 10px'>" +
            "<span style='display:inline-block; border-radius:5px;   width:10px;height:10px;background-color:#50CD89;color:#1D2129;'></span>" +
            "<span style='position: absolute; margin-left:15px; font-size: 12px; font-family: PingFang SC-Regular, PingFang SC; font-weight: 400; color: #4E5969;'>预算执行率</span>" +
            "<span style='font-size: 12px;font-family: PingFang SC-Regular, PingFang SC;font-weight: 400;color: #4E5969;'><span style='font-size: 14px; font-family: Helvetica Neue-Medium, Helvetica Neue; font-weight: 500; color: #1D2129;'>" +
            params[0]["data"] +
            "</span>%</span></div>";
        }
        return res;
      },
      axisPointer: {
        type: "line",
        lineStyle: {
          type: "solid",
        },
      },
      backgroundColor: "rgb(239, 242, 245,0.95)",
      borderColor: "rgb(239, 242, 245,0.95)",
      textStyle: {
        backgroundColor: "red",
      },
    },
    xAxis: {
      type: "category",
      data: xarray,
      name: "",
      axisTick: {
        //y轴刻度线
        show: false,
      },
      boundaryGap: false, // 不留白，从原点开始

      axisLine: {
        lineStyle: {
          color: "#a4a7aa",
        },
      },
    },
    yAxis: {
      // type: 'value',
      name: "%",
      axisTick: {
        //y轴刻度线
        show: false,
      },
      splitLine: {
        lineStyle: {
          type: "dashed", //虚线
        },
        show: true, //隐藏
      },
    },
    series: [
      {
        barMinWidth: 20000,
        data: yarray,
        type: "line",
        areaStyle: {
          color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
            {
              offset: 0,
              color: "#bce0cc",
            },
            {
              offset: 1,
              color: "white",
            },
          ]),
        },
        showSymbol: false, //是否默认展示圆点
        symbol: "circle", //设定为实心点
        symbolSize: 9, //设定实心点的大小
        smooth: true,

        itemStyle: {
          normal: {
            color: "#50CD89", //改变折线点的颜色
            borderColor: "white",
            borderWidth: 2,
            lineStyle: {
              color: "#50CD89", //改变折线颜色
            },

            tooltip: {
              trigger: "axis",
              axisPointer: {
                type: "cross",
                label: {
                  backgroundColor: "red",
                },
              },
              backgroundColor: "rgb(151, 151, 151,0.1)",
              borderColor: "rgb(151, 151, 151,0.1)",
            },
          },
        },
      },
    ],
  };

  option && myChart.setOption(option);
}

function getEvBudget(data) {
  var alldata = data;
  let thisdata = alldata[2]["data"];
  var xarray = [];
  var yarray = [];

  for (let i = 0; i < thisdata.length; i++) {
    // console.log(thisdata[i])
    xarray.push(thisdata[i]["key01"]);
    var ythisdata = thisdata[i]["key02"] * 100;
    var yythisdata = ythisdata.toFixed(1);
    yarray.push(yythisdata);
  }

  var app = {};

  var chartDom = document.getElementById("quarterbudget");
  var myChart = echarts.init(chartDom);
  var option;

  const posList = [
    "left",
    "right",
    "top",
    "bottom",
    "inside",
    "insideTop",
    "insideLeft",
    "insideRight",
    "insideBottom",
    "insideTopLeft",
    "insideTopRight",
    "insideBottomLeft",
    "insideBottomRight",
  ];
  app.configParameters = {
    rotate: {
      min: -90,
      max: 90,
    },
    align: {
      options: {
        left: "left",
        center: "center",
        right: "right",
      },
    },
    verticalAlign: {
      options: {
        top: "top",
        middle: "middle",
        bottom: "bottom",
      },
    },
    position: {
      options: posList.reduce(function (map, pos) {
        map[pos] = pos;
        return map;
      }, {}),
    },
    distance: {
      min: 0,
      max: 100,
    },
  };
  app.config = {
    rotate: 90,
    align: "left",
    verticalAlign: "middle",
    position: "insideBottom",
    distance: 15,
    onChange: function () {
      const labelOption = {
        rotate: app.config.rotate,
        align: app.config.align,
        verticalAlign: app.config.verticalAlign,
        position: app.config.position,
        distance: app.config.distance,
      };
      myChart.setOption({
        series: [
          {
            label: labelOption,
          },
          {
            label: labelOption,
          },
          {
            label: labelOption,
          },
          {
            label: labelOption,
          },
        ],
      });
    },
  };
  const labelOption = {
    position: app.config.position,
    distance: app.config.distance,
    align: app.config.align,
    verticalAlign: app.config.verticalAlign,
    rotate: app.config.rotate,
    formatter: "{c}  {name|{a}}",
    fontSize: 14,
    rich: {
      name: {},
    },
  };

  option = {
    grid: {
      show: false,
      top: "50px",
      left: "30px",
      right: "10px",
      bottom: "43px",
    },

    xAxis: {
      type: "category",
      data: xarray,
      axisTick: {
        //y轴刻度线
        show: false,
      },
      axisLine: {
        lineStyle: {
          color: "#a4a7aa",
        },
      },
    },
    yAxis: {
      name: "%",
      type: "value",
      axisTick: {
        //y轴刻度线
        show: false,
      },
      splitLine: {
        lineStyle: {
          type: "dashed", //虚线
        },
        show: true, //隐藏
      },
      axisLabel: {
        formatter: "{value}",
      },
    },
    series: [
      {
        data: yarray,
        type: "bar",
        width: 50,
        barWidth: "50px",
        itemStyle: {
          normal: {
            color: "#50CD89",
          },
        },
        label: {
          // 柱图头部显示值
          show: true,
          position: "top",
          color: "#333",
          fontSize: "12px",
          formatter: (params) => {
            let res = params.value + "%";
            return res;
          },
        },
      },
    ],
  };

  option && myChart.setOption(option);
}

function getBusinessRate(data) {
  var alldata = data;
  let thisdata = alldata[3]["data"];

  var realarray = [];
  for (var key in thisdata) {
    var param = {};
    // param.name= key;
    param.value = thisdata[key]["key07"] * 100;
    param.name = thisdata[key]["key02"];

    realarray.push(param);
  }

  var totalnum = 0;
  var strhtml = "";

  for (let i = 0; i < thisdata.length; i++) {
    var singenum = parseInt(thisdata[i]["key04"] / 10000);

    var totalnum = totalnum + singenum;

    var num1 = thisdata[i]["key04"] / 10000;
    var num11 = num1.toFixed(2);
    var num2 = thisdata[i]["key06"] * 100;
    var num22 = num2.toFixed(1);
    var num3 = thisdata[i]["key03"] / 10000;
    var num33 = num3.toFixed(2);
    var num4 = thisdata[i]["key05"] / 10000;
    var num44 = num4.toFixed(2);

    strhtml +=
      "<div class='esun-boxmin'>\
              <div class='boxmincontent'>\
                  <div class='contenttop'>\
                      <div class='topleft'>" +
      thisdata[i]["key02"] +
      " <a href='#'><img src='./assets/images/finance/icon-arrow@2x.png' style=' width: 25px; height: 25px; '></a></div>\
                  </div>\
                  <div class='implementmoney'>\
                      <ul>\
                          <li style='font-size: 16px;\
                          font-family: PingFang SC-Regular, PingFang SC;\
                          font-weight: 400;\
                          color: #4E5969;'>执行金额</li>\
                          <li style='font-size: 12px;\
                          font-family: PingFang SC-Regular, PingFang SC;\
                          font-weight: 400;\
                          color: #86909C;line-height: 40px;'><span>" +
      pricefmt(num11) +
      "</span>  万元</li>\
                      </ul>\
                  </div>\
                  <div class='implerate'>\
                     <ul>\
                         <li>执行率 <span>" +
      num22 +
      "%</span></li>\
                         <li>\
                           <div class='ratestrip' style='width:" +
      num22 +
      "%;'></div>\
                           <div class='ratestripunder'></div>\
                         </li>\
                     </ul>\
                  </div>\
                  <div class='themessage'>\
                      <div class='themessagedown'>\
                       <div class='downleft'>预算总额</div>\
                       <div class='downright'><span>" +
      pricefmt(num33) +
      "</span>  万元</div>\
                      </div>\
                      <div class='themessagedown'>\
                       <div class='downleft'>剩余金额</div>\
                       <div class='downright'><span>" +
      pricefmt(num44) +
      "</span>  万元</div>\
                      </div>\
                  </div>\
              </div>\
          </div>";
  }

  $(".esun-receive-type5").html(strhtml);

  var totalnum = pricefmt(totalnum);

  var chartDom = document.getElementById("abcd");
  var myChart = echarts.init(chartDom);
  var option;
  let image;
  let imageColor;

  option = {
    color: [
      "#165DFF",
      "#50CD89",
      "#FFC700",
      "#7239EA",
      "#0FC6C2",
      "#F1416C",
      "#B5BDCB",
    ],
    title: {
      zlevel: 0,
      text: "{a|" + "共计(万元)" + "}\n{b|" + totalnum + "}\n",
      x: "53%",
      y: "25%",
      width: 140,
      textAlign: "center",
      textStyle: {
        rich: {
          a: {
            fontSize: 12,
            color: "#4E5969",
          },
          b: {
            fontSize: 24,
            color: "#1D2129",
            fontWeight: 600,
            lineHeight: 40,
          },
          icon: {
            height: 16,
            width: 16,
            backgroundColor: {
              image: image,
            },
          },
          c: {
            fontSize: 12,
            color: imageColor,
          },
          d: {
            fontSize: 12,
            color: "#86909C",
          },
        },
      },
    },

    legend: {
      orient: "horizontal",
      // x: 'center',
      // y: 'bottom',

      itemGap: 15,
      height: "20%",

      width: "80%",
      top: "65%",
      left: "17%",
      itemHeight: 50,
      itemWidth: 5,
      formatter: function (name) {
        let target;
        for (let i = 0, l = alldata[3].data.length; i < l; i++) {
          if (alldata[3].data[i].key02 == name) {
            targett = alldata[3].data[i].key07 * 100;
            target = targett.toFixed(1);
          }
        }

        let arr = ["{a|" + name + "}{b|" + target + "} {c|%}"];
        return arr;
      },
      textStyle: {
        rich: {
          a: {
            fontSize: 12,
            verticalAlign: "top",
            align: "left",
            lineHeight: 19,
            padding: [6, 0, 0, 0],
            color: "#4E5969",
            width: 100,
          },
          b: {
            fontSize: 17,
            align: "right",
            padding: [30, 0, 0, -218],
            fontWeight: 600,
            color: "#1D2129",
          },
          c: {
            fontSize: 12,
            align: "bottom",
            padding: [30, -170, 0, 0],
            color: "#86909C",
          },
        },
      },
    },
    animation: false, //禁用动画
    silent: true, //禁用点击echart的鼠标动画
    series: [
      {
        name: "计划总数",
        type: "pie",
        radius: ["33%", "42%"],
        center: ["54%", "30%"],
        avoidLabelOverlap: false,
        itemStyle: {
          borderRadius: 0,
          borderColor: "#fff",
          borderWidth: 0,
        },
        label: {
          show: false,
          position: "center",
        },
        emphasis: {
          label: {
            show: false,
            fontSize: "40",
            fontWeight: "bold",
          },
        },
        labelLine: {
          show: false,
        },
        data: realarray,
      },
    ],
  };

  option && myChart.setOption(option);
}
function getBusinessRatee(data) {
  var alldata = data;
  let thisdata = alldata[3]["data"];

  var realarray = [];
  for (var key in thisdata) {
    var param = {};
    // param.name= key;
    param.value = thisdata[key]["key07"] * 100;
    param.name = thisdata[key]["key02"];

    realarray.push(param);
  }

  var totalnum = 0;
  var strhtml = "";

  for (let i = 0; i < thisdata.length; i++) {
    var singenum = parseInt(thisdata[i]["key04"] / 10000);

    var totalnum = totalnum + singenum;

    var num1 = thisdata[i]["key04"] / 10000;
    var num11 = num1.toFixed(2);
    var num2 = thisdata[i]["key06"] * 100;
    var num22 = num2.toFixed(1);
    var num3 = thisdata[i]["key03"] / 10000;
    var num33 = num3.toFixed(2);
    var num4 = thisdata[i]["key05"] / 10000;
    var num44 = num4.toFixed(2);

    strhtml +=
      "<div class='esun-boxmin'>\
              <div class='boxmincontent'>\
                  <div class='contenttop'>\
                      <div class='topleft'>" +
      thisdata[i]["key02"] +
      " <a href='#'><img src='./assets/images/finance/icon-arrow@2x.png' style=' width: 25px; height: 25px; '></a></div>\
                  </div>\
                  <div class='implementmoney'>\
                      <ul>\
                          <li style='font-size: 16px;\
                          font-family: PingFang SC-Regular, PingFang SC;\
                          font-weight: 400;\
                          color: #4E5969;'>执行金额</li>\
                          <li style='font-size: 12px;\
                          font-family: PingFang SC-Regular, PingFang SC;\
                          font-weight: 400;\
                          color: #86909C;line-height: 40px;'><span>" +
      pricefmt(num11) +
      "</span>  万元</li>\
                      </ul>\
                  </div>\
                  <div class='implerate'>\
                     <ul>\
                         <li>执行率 <span>" +
      num22 +
      "%</span></li>\
                         <li>\
                           <div class='ratestrip' style='width:" +
      num22 +
      "%;'></div>\
                           <div class='ratestripunder'></div>\
                         </li>\
                     </ul>\
                  </div>\
                  <div class='themessage'>\
                      <div class='themessagedown'>\
                       <div class='downleft'>预算总额</div>\
                       <div class='downright'><span>" +
      pricefmt(num33) +
      "</span>  万元</div>\
                      </div>\
                      <div class='themessagedown'>\
                       <div class='downleft'>剩余金额</div>\
                       <div class='downright'><span>" +
      pricefmt(num44) +
      "</span>  万元</div>\
                      </div>\
                  </div>\
              </div>\
          </div>";
  }

  $(".esun-receive-type5").html(strhtml);

  var totalnum = pricefmt(totalnum);

  var chartDom = document.getElementById("abcdd");
  var myChart = echarts.init(chartDom);
  var option;
  let image;
  let imageColor;

  option = {
    color: [
      "#165DFF",
      "#50CD89",
      "#FFC700",
      "#7239EA",
      "#0FC6C2",
      "#F1416C",
      "#B5BDCB",
    ],
    title: {
      zlevel: 0,
      text: "{a|" + "共计(万元)" + "}\n{b|" + totalnum + "}\n",
      x: "19.2%",
      y: "42%",
      width: 140,
      textAlign: "center",
      textStyle: {
        rich: {
          a: {
            fontSize: 12,
            color: "#86909C",
          },
          b: {
            fontSize: 24,
            color: "#1D2129",
            fontWeight: 600,
            lineHeight: 40,
          },
          icon: {
            height: 16,
            width: 16,
            backgroundColor: {
              image: image,
            },
          },
          c: {
            fontSize: 12,
            color: imageColor,
          },
          d: {
            fontSize: 12,
            color: "#86909C",
          },
        },
      },
    },

    legend: {
      orient: "vertical",
      x: "left",
      y: "center",
      itemGap: 30,
      height: "40%",
      width: "90%",
      left: "55%",
      itemHeight: 50,
      itemWidth: 5,
      formatter: function (name) {
        let target;
        for (let i = 0, l = alldata[3].data.length; i < l; i++) {
          if (alldata[3].data[i].key02 == name) {
            targett = alldata[3].data[i].key07 * 100;
            target = targett.toFixed(1);
          }
        }

        let arr = ["{a|" + name + "}{b|" + target + "} {c|%}"];
        return arr;
      },
      textStyle: {
        rich: {
          a: {
            fontSize: 12,
            verticalAlign: "top",
            align: "left",
            lineHeight: 19,
            padding: [6, 0, 0, 0],
            color: "#4E5969",
            width: "30%",
          },
          b: {
            fontSize: 17,
            align: "right",
            padding: [30, 0, 0, -118],
            fontWeight: 600,
            color: "#1D2129",
          },
          c: {
            fontSize: 12,
            align: "bottom",
            padding: [30, -225, 0, 0],
            color: "#86909C",
          },
        },
      },
    },
    animation: false, //禁用动画
    silent: true, //禁用点击echart的鼠标动画
    series: [
      {
        name: "计划总数",
        type: "pie",
        radius: ["60%", "77%"],
        center: ["19.5%", "214px"],
        avoidLabelOverlap: false,
        itemStyle: {
          borderRadius: 0,
          borderColor: "#fff",
          borderWidth: 0,
        },
        label: {
          show: false,
          position: "center",
        },
        emphasis: {
          label: {
            show: false,
            fontSize: "40",
            fontWeight: "bold",
          },
        },
        labelLine: {
          show: false,
        },
        data: realarray,
      },
    ],
  };

  option && myChart.setOption(option);
}

function getBusinessInfoo(data) {
  var alldata = data;
  let thisdata = alldata[4]["data"];

  var realarray = [];
  for (var key in thisdata) {
    var param = {};
    // param.name= key;
    var thisdatavalue = thisdata[key]["key06"] * 100;
    console.log(thisdatavalue, "--------占比--------");
    param.value = parseInt(thisdatavalue);
    param.name = thisdata[key]["key01"];

    realarray.push(param);
  }

  var totalnum = 0;
  var strHtml = "";

  for (let i = 0; i < alldata[4].data.length; i++) {
    var singenum = parseInt(thisdata[i]["key03"] / 10000);

    var totalnum = totalnum + singenum;

    var num1 = thisdata[i]["key03"] / 10000;
    var num11 = num1.toFixed(2);
    var num2 = thisdata[i]["key05"] * 100;
    var num22 = num2.toFixed(1);
    var num3 = thisdata[i]["key02"] / 10000;
    var num33 = num3.toFixed(2);
    var num4 = thisdata[i]["key04"] / 10000;
    var num44 = num4.toFixed(2);

    strHtml +=
      "<div class='esun-boxmin2'>\
                  <div class='boxmincontent'>\
                      <div class='contenttop'>\
                          <div class='topleft'>" +
      thisdata[i]["key01"] +
      " <a href='#'><img src='./assets/images/finance/icon-arrow@2x.png' style=' width: 25px; height: 25px; '></a></div>\
                      </div>\
                      <div class='implementmoney'>\
                          <ul>\
                              <li style='font-size: 16px;\
                              font-family: PingFang SC-Regular, PingFang SC;\
                              font-weight: 400;\
                              color: #4E5969;'>执行金额</li>\
                              <li style='font-size: 12px;\
                              font-family: PingFang SC-Regular, PingFang SC;\
                              font-weight: 400;\
                              color: #86909C;line-height: 40px;'><span>" +
      pricefmt(num11) +
      "</span>  万元</li>\
                          </ul>\
                      </div>\
                      <div class='implerate'>\
                         <ul>\
                             <li>执行率 <span>" +
      num22 +
      "%</span></li>\
                             <li>\
                               <div class='ratestrip' style='width:" +
      num22 +
      "%;'></div>\
                               <div class='ratestripunder'></div>\
                             </li>\
                         </ul>\
                      </div>\
                      <div class='themessage'>\
                          <div class='themessagedown'>\
                           <div class='downleft'>预算总额</div>\
                           <div class='downright'><span>" +
      pricefmt(num33) +
      "</span>  万元</div>\
                          </div>\
                          <div class='themessagedown'>\
                           <div class='downleft'>剩余金额</div>\
                           <div class='downright'><span>" +
      pricefmt(num44) +
      "</span>  万元</div>\
                          </div>\
                      </div>\
                  </div>\
              </div>";
  }
  $(".esun-receive-type7").html(strHtml);

  var totalnum = pricefmt(totalnum);

  var chartDom = document.getElementById("efghh");
  var myChart = echarts.init(chartDom);
  var option;
  let image;
  let imageColor;

  option = {
    color: ["#165DFF", "#50CD89", "#FFC700", "#B5BDCB"],
    title: {
      zlevel: 0,
      text: "{a|" + "共计(万元)" + "}\n{b|" + totalnum + "}\n",
      x: "19.2%",
      y: "42%",
      width: 140,
      textAlign: "center",
      textStyle: {
        rich: {
          a: {
            fontSize: 12,
            color: "#86909C",
          },
          b: {
            fontSize: 24,
            color: "#1D2129",
            fontWeight: 600,
            lineHeight: 40,
          },
          icon: {
            height: 16,
            width: 16,
            backgroundColor: {
              image: image,
            },
          },
          c: {
            fontSize: 12,
            color: imageColor,
          },
          d: {
            fontSize: 12,
            color: "#86909C",
          },
        },
      },
    },

    ///egfh的
    legend: {
      orient: "horizontal",
      x: "left",
      y: "center",
      itemGap: 30,
      height: "60%",
      width: "60%",
      left: "55%",
      itemHeight: 50,
      itemWidth: 5,
      formatter: function (name) {
        let target;
        for (let i = 0, l = alldata[4].data.length; i < l; i++) {
          if (alldata[4].data[i].key01 == name) {
            targett = alldata[4].data[i].key06 * 100;
            target = targett.toFixed(1);
          }
        }

        let arr = ["{a|" + name + "}{b|" + target + "} {c|%}"];
        return arr;
      },
      textStyle: {
        rich: {
          a: {
            fontSize: 12,
            verticalAlign: "top",
            align: "left",
            lineHeight: 19,
            padding: [6, 0, 0, 0],
            color: "#4E5969",
            width: "30%",
          },
          b: {
            fontSize: 17,
            align: "right",
            padding: [30, 0, 0, -118],
            fontWeight: 600,
            color: "#1D2129",
          },
          c: {
            fontSize: 12,
            align: "bottom",
            padding: [30, -225, 0, 0],
            color: "#86909C",
          },
        },
      },
    },
    animation: false, //禁用动画
    silent: true, //禁用点击echart的鼠标动画
    series: [
      {
        name: "计划总数",
        type: "pie",
        radius: ["60%", "77%"],
        center: ["19.5%", "214px"],
        avoidLabelOverlap: false,
        itemStyle: {
          borderRadius: 0,
          borderColor: "#fff",
          borderWidth: 0,
        },
        label: {
          show: false,
          position: "center",
        },
        emphasis: {
          label: {
            show: false,
            fontSize: "40",
            fontWeight: "bold",
          },
        },
        labelLine: {
          show: false,
        },
        data: realarray,
      },
    ],
  };
  console.log(option);
  option && myChart.setOption(option);
}

//////////////////////addEventListener/////////////////////////////////////
var myChart1 = echarts.init(document.getElementById("monthlybudget"));
var myChart2 = echarts.init(document.getElementById("quarterbudget"));
var myChart3 = echarts.init(document.getElementById("abcd"));
var myChart4 = echarts.init(document.getElementById("abcdd"));
var myChart5 = echarts.init(document.getElementById("efgh"));
var myChart6 = echarts.init(document.getElementById("efghh"));

window.addEventListener("resize", function () {
  myChart1.resize();
  myChart2.resize();
  myChart3.resize();
  myChart4.resize();
  myChart5.resize();
  myChart6.resize();
});
